<script lang="ts" setup>
import UseFeedback from '@/components/use-feedback/index.vue'
import { FeedbackType } from '@/models/sys'

const props = withDefaults(
  defineProps<{
    refresh?: () => void
  }>(),
  {},
)

const id = ref(0)
function open(_id: number) {
  id.value = _id
  show.value = true
}

defineExpose({
  open,
})

const show = ref(false)

const customStyle = 'height: 80vh;border-radius: 24rpx 24rpx 0 0;background: #f8f9fb;'

function close() {
  show.value = false
}

function success() {
  close()
  props.refresh?.()
}
</script>

<template>
  <view class="dialog">
    <page-meta :page-style="`overflow:${show ? 'hidden' : 'visible'};`"></page-meta>
    <wd-popup v-model="show" position="bottom" :custom-style="customStyle">
      <view class="relative" style="height: 100%">
        <UseFeedback
          :objectId="id"
          :type="FeedbackType.Recommend"
          @close="close"
          @success="success"
        />
      </view>
    </wd-popup>
  </view>
</template>

<style lang="scss" scoped>
.dialog {
  border-radius: 20rpx;
}
</style>
